<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<style>
    .deleteImg{
        width: 20px;
        position: relative;
        top: -100px;
        left: 100px;
        cursor: pointer;
        display: none;
    }
    .startImg{
        width: 100px;
        height: 100px;
        /*margin-left: 30px;*/
    }
</style>
<div class="main-content">
    <div class="box box-main">
        <form id="personnelImportForm" model="post" action="<c:url value="/web/admin/personnel/importUser.action"/>" method="post" enctype="multipart/form-data" class="form-horizontal">
            <div class="box-body">
                <div class="form-unit">导入文件</div>
                <div class="row">
                    <div class="col-xs-12">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                选择文件：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <div style="width: 100px;">
                                    <input type="file" style="" name="file" id="pic1" onchange="getimgload(1)"/>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-12">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                所属企业：<i class="fa icon-question hide"></i></label>
                            <label class="control-label col-sm-8" style="text-align: left" title="">
                                ${enterprise.enterpriseName}<i class="fa icon-question hide"></i></label>
                        </div>
                    </div>
                    <div class="col-xs-12">
                        <div class="form-group">
                            <label class="control-label col-sm-4" title="">
                                    <a href="<c:url value="/resources/file/user.xlsx"/>" download="用户模板.xlsx" class="btn btn-default btn-xs"><i class="fa fa-file-excel-o"></i> 下载模板</a>
                                </label>
                        </div>
                    </div>
                    <div class="col-xs-12">
                        <div class="form-group" style="color: red">
                            <label class="control-label col-sm-4" title="">
                                备注：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <div >
                                    数据导入过程可能需要一定时间，请耐心等待后加载页面
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-12">
                        <div class="form-group" style="color: red">
                            <label class="control-label col-sm-4" title="">
                                警告：<i class="fa icon-question hide"></i></label>
                            <div class="col-sm-8">
                                <div >
                                    手机号在本企业存在的话会覆盖原有数据，请慎重操作
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="box-footer">
                <div class="row">
                    <div class="col-sm-offset-2 col-sm-12">
                        <button type="submit" class="btn btn-sm btn-primary" id="btnSubmit"><i class="fa fa-check"></i> 保 存</button>&nbsp;

                        <button type="button" class="btn btn-sm btn-default" id="btnCancel" onclick="closeView()"><i class="fa fa-times"></i> 关 闭</button>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
<script>
    $("#personnelImportForm").validate({
        submitHandler: function(form){
            js.ajaxSubmitForm($(form), function(data){
                console.log('data.status'+data.status);
                if(data.status == Global.NO){
                    js.showMessage(data.msg);
                    closeView();
                    $('#dataGrid').dataGrid("refresh");
                    setTimeout(function (){
                        $('#dataGrid').dataGrid("refresh");
                    },1000)
                }else {
                    var msg="";
                    for(var o in data.data){
                        var num = parseInt(o)+1;
                        msg+=num+"、"+data.data[o].msg+'<br/>'
                    }
                    layer.open({
                        title:'错误信息提示',
                        type: 0,
                        area: ['500px', '60%'],
                        content: msg //注意，如果str是object，那么需要字符拼接。
                    });
                }
            }, "json");
        }
    });

    function closeView() {
        layer.close(LayWin['wPersonnelImport']);
    }
</script>
<script>
    <%--function delectImg(id) {--%>
        <%--$("#pic"+id).val('');--%>
        <%--$("#img"+id).attr("src","<c:url value="/resources/images/2.png" />");--%>
        <%--$("#delete"+id).hide();--%>
    <%--}--%>

    function getimgload(id){
        var obj=document.getElementById("pic"+id);
        var stuff=obj.value.match(/^(.*)(\.)(.{1,8})$/)[3];
        console.log(stuff);
        if (stuff != 'xls'&&stuff != 'xlsx') {
            alert('文件类型不正确');
            $("#pic"+id).val('');
            return false;
        }
        //判断图片
        if (stuff == 'xls') {
            var file=document.getElementById("pic"+id).files[0];
            var reader=new FileReader();
            reader.onload = function ( event ) {
                console.info("--------------:"+file.type);
                if(!/application\/\w+/.test(file.type)){
                    alert("文件必须为excel！");
                    $("#pic"+id).val('');
                    return false;
                }
                src = event.target.result;
                $("#img"+id).attr("src",src);
            };
            reader.readAsDataURL(file);
        }
        // $("#delete"+id).show();
    }
</script>


